import { defineComponent } from 'vue'
import { RightOutlined } from '@ant-design/icons-vue'
import homeIcons from '../../assets'
import '../../styles/player-video.less'

export default defineComponent({
  props: {
    type: {
      type: Number
    }
  },
  setup(props) {
    return () => (
      <div class="pl-4 mt-2 w-full">
        <h4 class="mb-2 text-sm font-medium text-black">{props.type === 4 ? '乐队的夏天3周年特辑' : '梦华录'}</h4>
        <span class="plyer-introduction">
          <i>2022/04/15</i> <i class="pl-1">发布</i>
          <i class="px-2">|</i>
          <i>{props.type === 4 ? '综艺音乐' : '古偶新剧'}</i>
          <label class="text-[#ffb027] pl-2">8.6分</label>
        </span>
        <p class="text-xs text-[#8f9299] mt-1 flex justify-between pr-4">
          <span>
            <span>
              <img src={homeIcons.hot} alt="" class="w-[14px] h-[14px] relative bottom-0.5 mr-1" />
              <span class="text-[#48494d]">7022</span>
            </span>
            <span class="px-3">
              <img src={homeIcons.like} alt="" class="w-[18px] h-[18px]relative bottom-1 mr-1" /> 1.4W
            </span>
            <span>
              <img src={homeIcons.collected} alt="" class="w-[18px] h-[18px] relative bottom-0.5 mr-1" /> 3.2W
            </span>
          </span>
          <span>
            简介
            <RightOutlined />
          </span>
        </p>
      </div>
    )
  }
})
